import React, { useState, Suspense } from 'react'
// import ComponentOne from './components/ComponentOne/index'
interface IProps {
  name: string
  age: number
}
const test = () => {
  const promise = new Promise((resolve) => {
    setTimeout(() => {
      resolve(100)
    }, 1000)
  })
  promise.then((res) => {
    console.log(res)
  })
}
console.log(test)
const ComponentOne = React.lazy(() => import('./components/ComponentOne'))
function App(props: IProps) {
  const [show, setShow] = useState(false)
  const { name, age }: { name: string; age: number } = props //我这里貌似并没有报错没写类型，有空可以看看
  const handleClick = () => {
    setShow(true)
  }
  return (
    <div className="app">
      <button onClick={handleClick}>Click11111111111111</button>
      {show && (
        <Suspense fallback={<div>正在加载中</div>}>
          <ComponentOne />
        </Suspense>
      )}
      <span>{`Hello! I'm ${name}, ${age} years old.`}</span>
    </div>
  )
}
export default App
